<div class="cloud-tools">
  <d-layout>
    <d-header>
      <app-header></app-header>
    </d-header>
    <d-layout>
      <d-aside>
        <d-splitter orientation="horizontal" [style.width]="collapsed ? 0 : undefined">
          <d-splitter-pane
            size="100%"
            minSize="125px"
            [collapsible]="true"
            [(collapsed)]="collapsed"
            (collapsedChange)="collapsed = $event"
          >
            <app-menu></app-menu>
          </d-splitter-pane>
          <d-splitter-pane size="0"></d-splitter-pane>
        </d-splitter>
      </d-aside>
      <d-content>
        <router-outlet></router-outlet>
      </d-content>
    </d-layout>
    <d-footer>
      <app-footer></app-footer>
    </d-footer>
  </d-layout>
</div>
